<template>
    <div class="ReportCase">
        <van-nav-bar title="报案" left-arrow @click-left="onClickLeft" />
        <van-row type="flex" justify="space-between" style="padding:16px">
            <van-col span="6" style="font-size:16px;line-height:32px">基本信息</van-col>
            <van-col span="6"><van-button style="float:right" plain type="info" size="small">常用</van-button></van-col>
        </van-row>
        <van-form @submit="onSubmit">
            <van-field v-model="username" label="证件类型" placeholder="请输入" :rules="[{ required: true, message: '请输入类型' }]" />
            <van-field v-model="password" label="证件号" placeholder="请输入" :rules="[{ required: true, message: '请输入类型' }]" />
            <van-field v-model="username" label="地区" placeholder="请输入" :rules="[{ required: true, message: '请输入联系人' }]" />
            <van-field v-model="password" label="开户行" placeholder="请输入" :rules="[{ required: true, message: '请输入联系电话' }]" />
            <van-field v-model="username" label="分支行名称" placeholder="请选择"
                :rules="[{ required: true, message: '请输入联系邮箱' }]" />
            <van-field v-model="password" label="卡号" placeholder="请选择" :rules="[{ required: true, message: '请输入地址' }]" />
            <van-field v-model="username" label="联系方式" placeholder="请输入"
                :rules="[{ required: true, message: '请输入联系地址' }]" />
            <van-field v-model="username" label="收款人姓名" placeholder="请输入"
                :rules="[{ required: true, message: '请输入联系地址' }]" />
            <div style="margin: 16px;">
                <van-button block type="info" native-type="submit">提交</van-button>
            </div>
        </van-form>

    </div>
</template>
  
<script>
export default {
    name: 'home',
    data() {
        return {
            username: '',
            password: '',
            uploader: [{ url: 'https://img01.yzcdn.cn/vant/leaf.jpg' }],
        };
    },
    methods: {
        onClickLeft() {
            this.$router.push('/reportCase')
        },
        onSubmit(values) {
            console.log('submit', values);
            this.$router.push('/ReportCaseNext')
        },
    }
}
</script>
<style scoped>
.ReportCase {
    background-color: #f5f5f5;
    height: 100%;
    width: 100%;
}
</style>
